<template>
  <view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
  <view style="width: 100%">
    <slot></slot>
  </view>
</template>

<script setup lang="ts">
import {
  ref,
  reactive,
  toRefs,
  watch,
  onMounted,
  getCurrentInstance,
} from 'vue'

const emit = defineEmits([''])
const props = defineProps({
  propData: {
    type: String,
    default: '',
  },
})
//const { } = toRefs(props);

const statusBarHeight = ref(0)

onMounted(() => {
  statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight as number

  console.log(uni.getSystemInfoSync().statusBarHeight, '222222')
})

const { data } = toRefs(
  reactive({
    //定义数组和对象
    data: '',
  })
)
</script>
<style lang="scss" scoped>
.status-bar {
  width: 100vw;
}
</style>
